<!--
 * @Author       : xh
 * @Date         : 2022-06-21 19:45:09
 * @LastEditors: y001554
 * @FileName     :   
-->
<template>
  <div id="app">
    <el-container direction="vertical">
      <!-- <YpDan title="默认" />
      <YpMounthPicker v-model="mounth" :yearlength="20" show-sum show-tips /> -->
      <el-header class="herader"> <h2>yl_plugins组件库</h2> </el-header>
      <el-container direction="horizontal">
        <el-aside width="200px">
          <el-menu default-active="2" class="el-menu-vertical-demo" style="height: 92vh">
            <el-submenu index="1">
              <template slot="title">
                <span style="color: #4094ff">常用小组件 </span>
              </template>
              <el-menu-item index="1-1">
                <router-link :to="{ name: 'dan' }" style="display: block">子弹统计图</router-link>
              </el-menu-item>
              <el-menu-item index="1-2">
                <router-link :to="{ name: 'multimounth' }" style="display: block">月份多选器</router-link>
              </el-menu-item>
              <el-menu-item index="1-3">
                <router-link :to="{ name: 'skus' }" style="display: block">skus生成器</router-link>
              </el-menu-item>
              <el-menu-item index="1-3">
                <router-link :to="{ name: 'citys' }" style="display: block">城市选择器</router-link>
              </el-menu-item>
            </el-submenu>

            <el-submenu index="2">
              <template slot="title">
                <span style="color: #4094ff">Layout模块 </span>
              </template>
              <el-menu-item index="2-4">
                <router-link :to="{ name: 'basicPage' }" style="display: block">BasicPage</router-link>
              </el-menu-item>
              <el-menu-item index="2-5">
                <router-link :to="{ name: 'genDrawer' }" style="display: block">GenDrawer</router-link>
              </el-menu-item>
              <el-menu-item index="2-6">
                <router-link :to="{ name: 'genModal' }" style="display: block">GenModal</router-link>
              </el-menu-item>
              <el-menu-item index="2-7">
                <router-link :to="{ name: 'genContainer' }" style="display: block">GenContainer</router-link>
              </el-menu-item>
              <el-menu-item index="2-8">
                <router-link :to="{ name: 'genForm' }" style="display: block">GenForm</router-link>
              </el-menu-item>
              <el-menu-item index="2-9">
                <router-link :to="{ name: 'genTable' }" style="display: block">GenTable</router-link>
              </el-menu-item>
              <!-- <el-menu-item index="2-10">
                <router-link :to="{ name: 'genQuarter' }" style="display: block">GenQuarter</router-link>
              </el-menu-item> -->
              <el-menu-item index="2-11">
                <router-link :to="{ name: 'genDescriptions' }" style="display: block">GenDescriptions</router-link>
              </el-menu-item>
            </el-submenu>
          </el-menu>
        </el-aside>
        <el-container direction="vertical" style="height: 92vh" class="markdown-body">
          <el-main height="">
            <router-view />
          </el-main>
          <!-- <el-footer height=""> xUI </el-footer> -->
        </el-container>
      </el-container>
    </el-container>
  </div>
</template>

<script>
// import Test from './components/Test'
export default {
  name: 'App',
  components: {
    // Test
  },
  mounted() {
    // this.$request('http://rest.apizza.net/mock/8b3df8e547994a420afc353aafe94efd/pro')
    // this.$request('http://rest.apizza.net/mock/8b3df8e547994a420afc353aafe94efd/pro')
    // this.$request('http://rest.apizza.net/mock/8b3df8e547994a420afc353aafe94efd/pro')
    // this.$request('http://rest.apizza.net/mock/8b3df8e547994a420afc353aafe94efd/pro')
  }
}
</script>

<style>
.herader {
  border-bottom: 1px solid #eee;
}
#app {
  width: 100vw;
  height: 100vh;
  overflow: hidden;
}
</style>
